<!--
 * @Author: LIZHAOJUN18 lizhaojun18@crdigital.com.cn
 * @Date: 2024-09-24 15:52:53
 * @LastEditors: LIZHAOJUN18 lizhaojun18@crdigital.com.cn
 * @LastEditTime: 2024-10-09 14:58:04
 * @FilePath: \console-web\src\views\trip\manager\trainStation\trainStation.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <!-- 页面-角色管理 -->
    <div class="innerPageTable-out-flex">
      <!-- 搜索区域 -->
      <SelfAdaption>
        <Form
          :model="searchForm"
          ref="searchForm"
          slot="adaption-bar"
          label-position="top"
          class="ivu-form-no-margin-bottom"
          inline
        >
          <template>
            <FormItem prop="stationName" label="车站名称">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['stationName']" 
                    placeholder="请输入车站名称" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="stationJaneSpell" label="车站简拼">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['stationJaneSpell']" 
                    placeholder="请输入车站简拼" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="stationTelegraphicCode" label="车站电报码">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['stationTelegraphicCode']" 
                    placeholder="请输入车站电报码" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="allJaneSpell" label="车站全拼">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['allJaneSpell']" 
                    placeholder="请输入车站全拼" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="hasSameCityStationFlag" label="同城车站标识">
                <Select style="width: 100%" v-model="searchForm['hasSameCityStationFlag']">
                    <Option value="1">存在</Option>
                    <Option value="0">不存在</Option>
                </Select>
            </FormItem>
            <FormItem prop="sameCityCode" label="同城编号">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['sameCityCode']" 
                    placeholder="请输入同城编号" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="einvoiceSupportStatus" label="电子发票标识">
                <Select style="width: 100%" v-model="searchForm['einvoiceSupportStatus']">
                    <Option value="0">不支持</Option>
                    <Option value="2">仅线上支持</Option>
                    <Option value="3">仅线下支持</Option>
                    <Option value="1">支持</Option>
                </Select>
            </FormItem>
            <FormItem prop="source" label="来源">
                <Select style="width: 100%" v-model="searchForm['source']">
                    <Option value="1">12306同步</Option>
                    <Option value="2">手工添加</Option>
                </Select>
            </FormItem>
            <FormItem prop="province" label="省份名称">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['province']" 
                    placeholder="请输入省份名称" clearable @on-enter="search">
                </Input>
            </FormItem>
            <FormItem prop="cityHierarchyLevel2" label="城市名称">
                <Input type="text" :maxlength="30" v-model.trim="searchForm['cityHierarchyLevel2']" 
                    placeholder="请输入城市名称" clearable @on-enter="search">
                </Input>
            </FormItem>
            <!-- 查询\重置按钮 -->
            <FormItem prop="button" class="search-solt-btn">
              <RPButton optType="search" @click="search" />
              <RPButton optType="reset" @click="reset" />
            </FormItem>           
          </template>
        </Form>
      </SelfAdaption>
      <InnerPageTable ref="searchTable" :config="tableConfig">
        <div slot="table-bar">
          <RPButton optType="create" @click="onOpenAddPage" v-permission="'ROLE_INDEX'" />
          <!--  -->
          <Dropdown @on-click="onDownMenu">
            <Button type="primary">
              批量操作
              <Icon type="ios-arrow-down"></Icon>
            </Button>
            <DropdownMenu slot="list">
              <DropdownItem name="disabled">禁用</DropdownItem>
            </DropdownMenu>
          </Dropdown>
        </div>
      </InnerPageTable>
    </div>
</template>
<script>
import debounce from "lodash/debounce";
import { apiQueryTrainStationPage, apiTrainStationDeleteBatchOperate } from '@api/trip/standard/trainStation.js';
export default {
    name: 'trip-train-station',
    mixins: [],
    data() {
        return {
            title: '火车站点管理',
            searchStatusList: [], //状态下拉框数据
            searchForm: {               
                stationName: '', //车站名称
                stationJaneSpell: '', //车站简拼
                stationTelegraphicCode: '', //车站电报码
                allJaneSpell: '', //车站全拼
                hasSameCityStationFlag: '', //是否存在同城车站标识。0:不存在同城站,1:存在同城站
                sameCityCode: '', //同城编号
                einvoiceSupportStatus: '', //是否支持开具电子发票标识
                source: '', //来源
                province: '', //省份名称
                cityHierarchyLevel2: '', //二级行政区城市名称
                isDelete: '', //是否启用
                // janeSpell: '', // 车站简拼
                // serialNumber: '', //序号       
                // stationStr: '', //车站信息（拼接成一个字符）
                // version: '', //字典版本号
                // createDate: '', //创建时间
                // updateDate: '', //更新时间
            }   
        }
    },
    watch: {},
    computed: {
    tableConfig() {
      return {
        border: true,
        loadDataFn: this.queryListByPage,
        columnsFn: () => {
          let columns = [
            {
              type: 'selection',
              width: 50,
              align: 'center'
            },
            {
              title: '序号',
              key: 'serialNumber',
              width: 80,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['serialNumber']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '车站名称',
              key: 'stationName',
              width: 150,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['stationName']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            
            {
              title: '车站简拼',
              key: 'stationJaneSpell',
              width: 100,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['stationJaneSpell']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '车站电报码',
              key: 'stationTelegraphicCode',
              width: 100,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['stationTelegraphicCode']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '车站全拼',
              key: 'allJaneSpell',
              width: 180,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['allJaneSpell']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '省份名称',
              key: 'province',
              width: 120,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['province']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '城市名称',
              key: 'cityHierarchyLevel2',
              width: 120,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['cityHierarchyLevel2']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '是否存在同城车站',
              key: 'hasSameCityStationFlag',
              width: 180,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['hasSameCityStationFlag']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title == '1' ? [h('Tag', { props: { color: 'default' } }, '存在')] :
                  title == '0' ? [h('Tag', { props: { color: 'default' } }, '不存在')] :
                  []
                )
              }
            },
            {
              title: '同城编号',
              key: 'sameCityCode',
              width: 100,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['sameCityCode']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '开具电子发票',
              key: 'einvoiceSupportStatus',
              width: 180,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['einvoiceSupportStatus']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title == '1' ? [h('Tag', { props: { color: 'default' } }, '支持')] :
                  title == '0' ? [h('Tag', { props: { color: 'red' } }, '不支持')] :
                  title == '2' ? [h('Tag', { props: { color: 'default' } }, '仅线上支持')] :
                  title == '3' ? [h('Tag', { props: { color: 'default' } }, '仅线下支持')] :
                  []
                )
              }
            },
            {
              title: '车站信息',
              key: 'stationStr',
              width: 360,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['stationStr']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '字典版本号',
              key: 'version',
              width: 200,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['version']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title
                )
              }
            },
            {
              title: '来源',
              key: 'source',
              width: 80,
              resizable: true,
              align: 'center',
              render: (h, params) => {
                let title = params.row['source']
                return h(
                  'div',
                  {
                    attrs: {
                      class: 'ivu-table-cell ivu-table-cell-ellipsis',
                      title: title
                    }
                  },
                  title == '1' ? [h('Tag', { props: { color: 'blue' } }, '12306')] :
                  title == '2' ? [h('Tag', { props: { color: 'default' } }, '手工添加')] :
                  []
                )
              }
            },
            {
              title: this.$t('common.operating'),
              align: 'left',
              fixed: 'right',
              resizable: true,
              width: 150,
              render: (h, { row }) => {
                let data = []
                if (row.source == '2') {
                  data = [
                    {
                      text: '编辑',
                      handle: debounce(() => this.onOpenEditPage(row), 300)
                    },
                    {
                      text: '禁用',
                      handle: debounce(() => this.onUpdate(row), 300)
                    }
                  ]
                } else {
                }
                return h('RowTools', {
                  props: {
                    data: data
                  }
                })
              }
            }
          ]
          return columns
        },
        autoFirst: false,
        rowClassNameFn: this.rowClassName // 自定义行样式
      }
    },
  },
  created: function() {
    
  },
  mounted() {
  },
  methods: {
    /**
     * 获取表格中选择的行ID
     */
    getSelectedIds() {
      let list = this.$refs['searchTable'].getSelectioned() || []
      let ids = []
      for (let u of list) {
        ids.push(u.id)
      }
      return ids
    },
    onDownMenu(name) {
      let ids = this.getSelectedIds();
      if (ids.length > 0) {
        const confirmMessages = {
          'disabled': '您确定要禁用所选择的火车车站数据吗？',
        };
        const successMessages = {
          'disabled': '禁用成功',
        };
        if (confirmMessages[name] ) {
          new $confirm(confirmMessages[name], this).then(() => {
            this.performBatchOperate(ids)
              .then(() => {
                this.$message.success({
                  content: successMessages[name],
                  duration: 3
                });
                this.search();
              })
              .catch(data => {
                this.$message.error({
                  content: data.message,
                  duration: 3
                });
              });
          });
        }
      }
    },

    performBatchOperate(ids) {
      return apiTrainStationDeleteBatchOperate({ ids: ids.join(',') });
    },
    // 自定义行样式
    rowClassName(row) {
      //关联的菜单中是否存在有效的hasEnabledMenu:1-存在,0-不存在
      if (row.hasEnabledMenu == 0) {
        return 'tableDisableStyle'
      }
    },
    async init() {
    //   let { userInfo } = $store.state[CoreModuleName]
    //   if (!userInfo) return
    //   this.category = userInfo.category
    //   // 根据当前租户查询数据
    //   // this.searchForm.tenantCode = userInfo.tenantCode
    //   const [appData] = await Promise.all([
    //     // valueSetAPI.getValueSetByCode('ROLE_TYPE'),
    //     searchAppListByTenantCode({
    //       pageNum: 1,
    //       pageSize: 200,
    //       condition: {
    //         tenantCode: userInfo.tenantCode
    //       }
    //     })
    //   ])
    //   console.log('appData :>> ', appData)
      // 查询列表
      this.search()
    },

    search(page = 1) {
      let searchParams = Object.assign({}, this.searchForm)
      this.$refs['searchTable'].load(searchParams, page)
    },
    /**
     * 重置搜索表单并重新执行搜索
     *
     * 重置搜索表单字段，并将搜索页码设为1，然后执行搜索操作。
     */
    reset() {
      // 检查searchForm引用是否存在
      if (this.$refs['searchForm'] && typeof this.$refs['searchForm'].resetFields === 'function') {
        // 重置搜索表单字段
        this.$refs['searchForm'].resetFields();
    
        // 检查search方法是否存在
        if (typeof this.search === 'function') {
          // 执行搜索，页码为1
          this.search(1);
        } else {
          console.error('The search method does not exist.');
        }
      } else {
        console.error('The searchForm reference does not exist or resetFields is not a function.');
      }
    },
    /**
     * 更新行数据状态函数
     *
     * @param row 需要更新的行数据对象
     * @param enabled 状态值，1表示启用，非1表示禁用
     */
    onUpdate(row) {
      new $confirm('您确定要禁用该行车站数据吗？', this).then(() => {
        // enabled 0 禁用
        apiTrainStationDeleteBatchOperate({ ids: row.id + '' })
          .then(res => {
            this.$message.success({
              content: '修改成功',
              duration: 3
            })
            this.search()
          })
          .catch(data => {
            this.$message.error({
              content: data.message,
              duration: 3
            })
          })
      })
    },
    onDel(row) {
    //   new $confirm('您确定要删除该行差标职级数据吗？', this).then(() => {
    //     apiStandardPositionBatchOperate({ ids: row.id + '', enabled: '2' })
    //       .then(res => {
    //         this.$message.success({
    //           content: this.$t('module.orgManage.deleteSuccess'),
    //           duration: 3
    //         })
    //         this.search()
    //       })
    //       .catch(data => {
    //         this.$message.error({
    //           content: data.message,
    //           duration: 3
    //         })
    //       })
    //   })
    },
    onOpenEditPage(row) {
      new this.$sidelipPage(
        () => import('./trainStationDetail.vue'),
        {
          props: {
            TrainStation: Object.assign({},row),
            disabled:false,
          },
          isActionTop: false
        },
        data => {
          data && this.search()
        }
      )
    },
    onOpenAddPage: debounce(function() {
      new this.$sidelipPage(
        () => import('./trainStationDetail.vue'),
        {
          props: { 
            disabled: false
          },
          isActionTop: false
        },
        data => {
          data && this.search()
        }
      )
    }, 300),

    queryListByPage({ responseProcess, param }) {
      console.log('param :>> ', param)
      return apiQueryTrainStationPage(param).then(data => {
        console.log('data :>> ', data)
        if (data.success) {
            if(data.data != null){
                responseProcess(data.data)
            }else{
                responseProcess({ records: [] })
            }
        } else {
          this.$message.error({
            content: data.message || '未查询到火车站点信息',
            duration: 3
          })
          responseProcess({ records: [] })
        }
      })
    }
  }
}

</script>

